<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

		<link href="../../../css/mui.css" rel="stylesheet" />
		<link href="../../../css/common.css" rel="stylesheet" />

		<style>
			.mui-table-view{
			margin-top: 0px !important;
			position: relative;
			}
			.mui-control-content {
				background-color: white;
				min-height: 760px;
			}
			.mui-table-view-cell{
				height: 50px;
				line-height: 30px;
				margin-bottom: 0px;
			}
			.limit-right-top{
				float: right;
				color: goldenrod;
			}
			.cardbot{
				display: -webkit-flex;
				display: flex;
				justify-content: space-between;
				/* margin-top: -10px; */
			}
			.line{
				width: 10px;
				height: 10px;
				border-radius: 50%;
				border: 1px solid darkgoldenrod;
				float: left;
				margin-top: 10px;
				position: relative;
			}
			.line:before{
				content:"";
				height: 25px;
				border: 1px solid darkgoldenrod;
				top: -28px;
				position: absolute;
				left: 3px;
			}
			.line:after{
				content:"";
				height: 30px;
				border: 1px solid darkgoldenrod;
				top: 8px;
				position: absolute;
				left: 3px;
			}
			.firstline{
				width: 15px;
				height: 15px;
				border-radius: 50%;
				border: 4px solid darkgoldenrod;
				float: left;
				margin-top: 10px;
				margin-left: -3px;
				position: relative;
			}
			.firstline:after{
				content:"";
				height: 15px;
				border: 1px solid darkgoldenrod;
				top: 11px;
				position: absolute;
				left: 3px;
			}
			.ultitle{
				/* float: left; */
				width: 100px;
				height: 50px;
				/* margin: 10px; */
				position: absolute;
				top: -5px;
				left: 5px;
				font-weight: bold;
				
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left touch-action"></a>
			<h1 class="mui-title">收益明细</h1>
		</header>

		<div class="mui-content" id="mui-content">
			<div class="mui-slider-group">
				<div id="item1mobile" class="mui-slider-item mui-control-content mui-active">
					<div id="scroll1" class="mui-scroll-wrapper">
						<div class="mui-scroll">
							<ul class="mui-table-view item1ul" v-for="items in earnDetailList">
								<li class="mui-table-view-cell">
									<span class="ultitle">{{items.date}}</span>
									<div class="firstline"></div>
								</li>
								<li class="mui-table-view-cell" v-for="item in items.list">
									<div class="line"></div>
									<div class="mui-card-content">
										<div class="cardbot">
											<div></div>
											<span class="present-title">{{item.phone}}</span><br>
											<p class="present-time">{{item.type==1?'分润':'返佣'}}</p>
											<span class="limit-right-top">{{item.income_amount_explain}}</span><br>
											<p class="limit-right-bottom">{{item.time}}</p>
										</div>
									</div>
								</li>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>

		<script src="../../../js/mui.js"></script>
		<script src="../../../js/common.js"></script>
		<script src="../../../js/md5.min.js"></script>		
		<script src="../../../js/vue.min.js"></script>

		<script type="text/javascript">
			mui.init();
			mui.plusReady(function() {
				var da ={};
				var token=localStorage.logintoken;
				//vue.js的数据
				da["token"]=token;
						
				var signkey=localStorage.signkey;
				var signcode=sign(da,signkey);
				
				da['sign']=signcode;
				//收益明细(不分类接口)
				var url=address("/api/Fund/incomeDetail");
				mui.post(url,
				da,
				function(data){
					// console.log(JSON.stringify(data));
					if (data.code == 1 && (typeof(token) != undefined)) {
						plus.nativeUI.toast(data.msg);
						let curdata = data.data.data;
						if(curdata.length == 0){
							return;
						}
						vm.earnDetailList = curdata;
					}else{
						plus.nativeUI.toast(data.msg);
					}
				},'json')
				mui('.mui-scroll-wrapper').scroll({
					indicators: true //是否显示滚动条
				});
				
				var wrapper_height = mui('.mui-scroll-wrapper')[0].offsetHeight-20;
				mui('.mui-scroll-wrapper')[0].style.height = wrapper_height+'px';
			});
			var vm = new Vue({
				el: '#mui-content',
				data: {
					earnDetailList:null
				}
			});
		</script>
	</body>

</html>
